import 'package:flutter/material.dart';
import 'package:my_flutter_app/main.dart';

class TextFieldAndFormRoute extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("输入框及表单"),
      ),
      body: Column(
        children: <Widget>[
          RaisedButton(
            child: Text("TO TextFieldAndFormTest"),
            onPressed: () {
              Navigator.push(context, MaterialPageRoute(builder: (context) {
                return TextFieldAndFormTestRoute();
              }));
            },
          ),
          RaisedButton(
            child: Text("TO FocusTestRoute"),
            onPressed: () {
              Navigator.push(context, MaterialPageRoute(builder: (context) {
                return FocusTestRoute();
              }));
            },
          ),
          RaisedButton(
            child: Text("TO FormTestRoute"),
            onPressed: () {
              Navigator.push(context, MaterialPageRoute(builder: (context) {
                return FormTestRoute();
              }));
            },
          ),

        ],
      ),
    );
  }
}

class TextFieldAndFormTestRoute extends StatefulWidget {
  @override
  _TextFieldAndFormTestRouteState createState() =>
      _TextFieldAndFormTestRouteState();
}

class _TextFieldAndFormTestRouteState extends State<TextFieldAndFormTestRoute> {
  TextEditingController _unameController = TextEditingController();

  @override
  Widget build(BuildContext context) {
    _unameController.text = "dfdfdfdfdfdfdf";
    _unameController.selection = TextSelection(
        baseOffset: 2, extentOffset: _unameController.text.length);
    _unameController.addListener(() {
      print(MY_TAG_1 + "listener: " + _unameController.text);
    });
    return Scaffold(
      appBar: AppBar(
        title: Text("输入框及表单"),
      ),
      body: Theme(
        data: Theme.of(context).copyWith(
          hintColor: Colors.grey[200],
          inputDecorationTheme: InputDecorationTheme(
            labelStyle: TextStyle(color: Colors.grey),
            hintStyle: TextStyle(color: Colors.grey, fontSize: 14.0),
          ),
        ),
        child: Column(
          children: <Widget>[
            TextField(
              autofocus: true,
              controller: _unameController,
              decoration: InputDecoration(
                labelText: "用户名",
                hintText: "用户名或邮箱",
                prefixIcon: Icon(Icons.person),
                enabledBorder: UnderlineInputBorder(
                  borderSide: BorderSide(color: Colors.grey),
                ),
                focusedBorder: UnderlineInputBorder(
                  borderSide: BorderSide(color: Colors.blue),
                ),
              ),
              onChanged: (s) {
                print(MY_TAG_1 + "onChanged: " + s);
              },
            ),
            TextField(
              decoration: InputDecoration(
                labelText: "密码",
                hintText: "您的登录密码",
                prefixIcon: Icon(Icons.lock),
                hintStyle: TextStyle(color: Colors.grey, fontSize: 13.0),
              ),
              obscureText: true,
            ),
            RaisedButton(
              child: Text("获取输入框内容"),
              onPressed: () {
                print(MY_TAG_1 + "用户名: " + _unameController.text);
              },
            ),
            TextField(
              decoration: InputDecoration(
                labelText: "请输入用户名",
                prefixIcon: Icon(Icons.person),
                // 未获得焦点下划线设为灰色
                enabledBorder: UnderlineInputBorder(
                  borderSide: BorderSide(color: Colors.grey),
                ),
                //获得焦点下划线设为蓝色
                focusedBorder: UnderlineInputBorder(
                  borderSide: BorderSide(color: Colors.blue),
                ),
              ),
            ),
            Container(
              child: TextField(
                keyboardType: TextInputType.emailAddress,
                decoration: InputDecoration(
                  labelText: "Email",
                  hintText: "电子邮件地址",
                  prefixIcon: Icon(Icons.email),
                  border: InputBorder.none,
                ),
              ),
              decoration: BoxDecoration(
                border: Border(
                    bottom: BorderSide(color: Colors.grey[200], width: 1.0)),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

class FocusTestRoute extends StatefulWidget {
  @override
  _FocusTestRouteState createState() => _FocusTestRouteState();
}

class _FocusTestRouteState extends State<FocusTestRoute> {
  FocusNode focusNode1 = FocusNode();
  FocusNode focusNode2 = FocusNode();

  FocusScopeNode focusScopeNode;

  @override
  Widget build(BuildContext context) {
    focusNode1.addListener(() {
      print(MY_TAG_1 + "focusNode1: " + focusNode1.hasFocus.toString());
    });
    focusNode2.addListener(() {
      print(MY_TAG_1 + "focusNode2: " + focusNode2.hasFocus.toString());
    });
    return Scaffold(
      appBar: AppBar(
        title: Text("焦点控制"),
      ),
      body: Padding(
        padding: EdgeInsets.all(16),
        child: Column(
          children: <Widget>[
            TextField(
              autofocus: true,
              focusNode: focusNode1,
              decoration: InputDecoration(
                labelText: "input1",
              ),
            ),
            TextField(
              focusNode: focusNode2,
              decoration: InputDecoration(
                labelText: "input2",
              ),
            ),
            Column(
              children: <Widget>[
                RaisedButton(
                  child: Text("移动焦点"),
                  onPressed: () {
                    // FocusScope.of(context).requestFocus(focusNode2);

                    if (null == focusScopeNode) {
                      focusScopeNode = FocusScope.of(context);
                    }
                    focusScopeNode.requestFocus(focusNode2);
                  },
                ),
                RaisedButton(
                  child: Text("隐藏键盘"),
                  onPressed: () {
                    focusNode1.unfocus();
                    focusNode2.unfocus();
                  },
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}

class FormTestRoute extends StatefulWidget {
  @override
  _FormTestRouteState createState() => _FormTestRouteState();
}

class _FormTestRouteState extends State<FormTestRoute> {
  TextEditingController _unameController = TextEditingController();
  TextEditingController _pwdController = TextEditingController();

  GlobalKey _formKey = GlobalKey<FormState>();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("表单测试"),
      ),
      body: Padding(
        padding: EdgeInsets.symmetric(vertical: 16.0, horizontal: 24.0),
        child: Form(
          key: _formKey,
          autovalidate: true,
          child: Column(
            children: <Widget>[
              TextFormField(
                autofocus: true,
                controller: _unameController,
                decoration: InputDecoration(
                  labelText: "用户名",
                  hintText: "用户名或邮箱",
                  icon: Icon(Icons.person),
                ),
                validator: (s) {
                  return s.trim().length > 0 ? null : "用户名不能为空";
                },
              ),
              TextFormField(
                controller: _pwdController,
                decoration: InputDecoration(
                  labelText: "密码",
                  hintText: "您的登录密码",
                  icon: Icon(Icons.lock),
                ),
                obscureText: true,
                validator: (s) {
                  return s.trim().length > 5 ? null : "密码不能少于6位";
                },
              ),
              Padding(
                padding: EdgeInsets.only(top: 28.0),
                child: Row(
                  children: <Widget>[
                    Expanded(
                      child: RaisedButton(
                        padding: EdgeInsets.all(15.0),
                        child: Text("登录1"),
                        color: Theme.of(context).primaryColor,
                        textColor: Colors.white,
                        onPressed: () {
                          // 在这里不能通过此方式获取FormState，context不对
                          // print(MY_TAG_1 + Form.of(context).toString());
                          // print(MY_TAG_1 + (_formKey.currentState as FormState).toString());
                          if((_formKey.currentState as FormState).validate()) {
                            print(MY_TAG_1 + "提交");
                          }
                        },
                      ),
                    ),
                    Expanded(
                      // 通过Builder来获取RaisedButton所在widget树的真正context(Element)
                      child: Builder(builder: (context) {
                        return RaisedButton(
                          padding: EdgeInsets.all(15.0),
                          child: Text("登录2"),
                          color: Theme.of(context).primaryColor,
                          textColor: Colors.white,
                          onPressed: () {
                            print(MY_TAG_1 + Form.of(context).toString());
                            // print(MY_TAG_1 + (_formKey.currentState as FormState).toString());

                            /*
                            if((_formKey.currentState as FormState).validate()) {
                              print(MY_TAG_1 + "提交");
                            }
                            */
                            if(Form.of(context).validate()) {
                              print(MY_TAG_1 + "提交");
                            }
                          },
                        );
                      }),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}
